<template>
  <a-modal
    :title="title"
    :width="600"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <div>
      <a-form-model :model="model" :form="form" :rules="rules" ref="form">
        <a-space>
          用户：
          <m-select-multi-user
            style="width: 500px;"
            v-decorator="['userId', { rules: [{ required: true, message: '请选择员工' }] }]"
            :multiple="false"
            @submitSelect="userSelect"
            :disabled="false"
          />
        </a-space>

        <a-row
          style="margin-top: 20px"
          :gutter="16"
        >
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="开始时间" prop="startTime">
              <a-date-picker v-model:value="startTime" style="width: 100%;" placeholder="选择日期" :allowClear="false"
                             @change="onChangeStartTime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="公司" prop="company">
              <j-dict-select-tag placeholder="请选择公司" v-model="model.company" dictCode="crm_company,name,id"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row
          :gutter="16"
        >
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结束时间" prop="endTime">
              <a-date-picker v-model:value="endTime" style="width: 100%;" placeholder="选择日期" :allowClear="false"
                             @change="onChangeEndTime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="工种" prop="workType">
              <j-dict-select-tag placeholder="请选择工种" v-model="model.workType" dictCode="work_type"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row
          :gutter="16"
        >
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="计划日期" prop="planTime">
              <a-date-picker v-model:value="planTime" style="width: 100%;" placeholder="选择日期" :allowClear="false"
                             @change="onChangePlanTime"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="车间" prop="workshop">
              <j-dict-select-tag placeholder="请选择车间" v-model="model.workshop" dictCode="workshop"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row
          :gutter="16"
        >
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="考勤状态" prop="attendanceStatus">
              <j-dict-select-tag placeholder="请选择考勤状态" v-model="model.attendanceStatus" dictCode="attendance_status"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="工序" prop="workingProcedure">
              <j-dict-select-tag placeholder="请选择车间" v-model="model.workingProcedure" dictCode="working_procedure"/>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row
          :gutter="16"
        >
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="机台选择" prop="selectText">
              <a-space>
                <a-input placeholder="请选择" style="width:100%" readOnly v-model="selectText"></a-input>
                <a-button type="primary" icon="plus" size="small" @click="showModal('spunYarnDevices')"></a-button>
              </a-space>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注" prop="remark">
              <a-input placeholder="请选择" style="width:100%" v-model="model.remark"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </div>
    <jitai-modal ref="shumianModal" @planChoseSubmit="planChoseSubmit"></jitai-modal>
  </a-modal>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import MSelectMultiUser from './MSelectMultiUser'
import JitaiModal from './JitaiModal'
import { httpAction } from '@/api/manage'
import pick from 'lodash.pick'
import JEditor from '@/components/jeecg/JEditor'
import JSwitch from '@/components/jeecg/JSwitch'
import { getUser } from '@api/customApi'
import moment from 'moment'
const path = '/crm_daily_plan_spun_yarn/crmDailyPlanSpunYarn'
export default {

  mixins: [JeecgListMixin],
  name: 'UserSelectModal',
  components: {
    MSelectMultiUser,
    JitaiModal,
    JEditor,
    JSwitch
  },
  data() {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 }
      },
      dataSource1: [],
      startTime: null,
      endTime: null,
      planTime: moment(new Date()).format('YYYY-MM-DD'),
      userName: '',
      selectNumber: '1',
      title: '操作',
      visible: false,
      disable: true,
      model: {},
      selectText:'',
      confirmLoading: false,
      form: this.$form.createForm(this),
      url: {
        list: path + '/list',
        add: '/crm_scheduling_spun_yarn/crmSchedulingSpunYarn/add',
        // edit: '/crm_scheduling_spun_yarn/crmSchedulingSpunYarn/edit'
      }
    }
  },
  created() {
  },
  mounted() {

  },
  methods: {
    userSelect(e) {
      this.userInfo = e[0]
      this.model.realname = this.userInfo.realname
      this.model.userId = this.userInfo.id
      this.model.workNo = this.userInfo.workNo
      this.model.avatar = this.userInfo.avatar
      console.log(e)
    },
    onChangeStartTime(date, dateString) {
      this.model.startTime = dateString + " 00:00:00"
    },
    onChangeEndTime(date, dateString) {
      this.model.endTime = dateString + " 00:00:00"
    },
    onChangePlanTime(date, dateString) {
      this.model.planTime = dateString
    },
    showModal(param){
      this.$refs.shumianModal.show(this.model.schedulingSpunYarnDevices, param, true)
    },
    planChoseSubmit(params, selectPlanData, choseNum) {
      //选择的机台id
      selectPlanData.forEach((item) => {
        item.deviceIds = item.deviceIds.join(',')
      })
      console.log(selectPlanData)
      this.model.schedulingSpunYarnDevices = selectPlanData
      if(selectPlanData.length > 0){
        this.selectText = '已选择：' + choseNum.length + '台'
        this.model.deviceNum = choseNum.length
      }else{
        this.selectText = ''
      }
    },
    add() {
      this.disable = false
      this.model = Object.assign({}, )
      this.model.workingProcedure = 2
      this.selectText = ''
      this.edit({}, 1)
    },
    edit(record, isEdit) {
      if (isEdit != 1) {
        this.model = Object.assign({}, record)
      }
      this.visible = true
    },
    close() {
      this.$emit('close')
      this.visible = false
      this.disable = true
    },

    handleOk() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          let formData = Object.assign(this.model)
          console.log('formData', formData)
          //时间格式化
          httpAction(httpurl, formData, method)
            .then(res => {
              if (res.success) {
                this.$message.success(res.message)
                this.$emit('ok')
              } else {
                this.$message.warning(res.message)
              }
            })
            .finally(() => {
              this.confirmLoading = false
              this.close()
            })
        } else {
          return false
        }
      })
    },
    onChangePage(e) {
      this.ipagination.current = e
      this.loadData()
    },
    handleCancel() {
      this.close()
    }
  }
}
</script>

<style scoped></style>
